Beispiel: Responsives Design
Produkt: CODESYS Visualization
Das Beispielprojekt zeigt, wie Sie eine Visualisierung so erstellen können, dass diese auf die Größeneigenschaften des jeweils benutzten Endgeräts reagiert.
Beschreibung
Die Visualisierung lädt je nach Bildschirmgröße des aufrufenden Geräts unterschiedliche Visualisierungen. So ist es möglich, das Design für Monitore, Tablets und Smartphones zu optimieren.
Weitere Informationen
Applikation ResponsiveInPage
Das Beispiel zeigt, wie eine Visualisierung in einem einzelnen Objekt mit der Schnittstelle ISizeProvider der Bibliothek VisuElems responsive erstellt werden kann.
In der Funktion IsPortrait wird ermittelt, ob es sich um ein Protrait- oder Landscape-Layout handelt.
Für weitere Informationen siehe: Responsives Design verwenden
Applikation ResponsiveSeveralPages
Im Programm PLC_PRG wird der Funktionsbaustein ClientManagerListener am globalen ClientManager registriert. In der Funktion SetStartVisu wird die Visualisierung abhängig von der Bildschirmgröße des Clients gesetzt. Diese Funktion wird von der Methode StartVisualizationSet des ClientManagerListeners aufgerufen.
 |
 |
 |
Sie können das Beispielprojekt mit einem Webbrowser testen, indem Sie die Größe des Browsers ändern und die Seite neu laden.
Systemvoraussetzungen und Einschränkungen
Programmiersystem | CODESYS Development System Version 3.5.18.0 oder höher |
Laufzeitsystem | CODESYS Control Win Version 3.5.18.0 oder höher |
Add-on | CODESYS Visualization Version 4.7.0.0 oder höher |
Zusatzkomponenten | - |
Hinweis
DOWNLOAD Projekt